<template>
 
    

<el-container>



  <el-main>

    

  <el-form 
        :label-position="labelPosition" 
        label-width="100px" 
        :model="formLabelAlign">

        <el-form-item label="用户ID">
          <el-input v-model="formLabelAlign.userid" :disabled="true" >做个测试，不用双括号</el-input>
        </el-form-item>

        <el-form-item label="用户名">
          <el-input v-model="formLabelAlign.name" :disabled="true" >{{formLabelAlign.name}}</el-input>
        </el-form-item>
     
        <el-form-item label="电话号码">
          <el-input v-model="formLabelAlign.phone" :disabled="true" >{{formLabelAlign.phone}}</el-input>
        </el-form-item>
        <el-form-item label="电子邮箱">
          <el-input v-model="formLabelAlign.email" :disabled="true" >{{formLabelAlign.email}}</el-input>
        </el-form-item>
        <el-form-item label="注册时间">
          <el-input v-model="formLabelAlign.created" :disabled="true" >{{formLabelAlign.created}}</el-input>
        </el-form-item>
         
   </el-form>

  
  </el-main>

    <el-button type="primary" size="mini" @click="home">回到主页</el-button>
  
</el-container>


 


</template>



<script>
  export default {
    data() {
      return {
        labelPosition: 'left',
        formLabelAlign: {
        
          userid: localStorage.getItem("userid"),
          name:  localStorage.getItem("username"),
          phone: localStorage.getItem("phone"),
          email: localStorage.getItem("email"),
          created: localStorage.getItem("created"),
        
        }
      };
    },


    methods:{
    home(){
       this.$router.push({ path:"/" }) 
    },




    }


   

}
</script>













<style scoped>

.el-header {
    background-color: #B3C0D1;
    color: #333;
    text-align: center;
    font-size:20px;
    
    line-height: 60px;
    
  }
  
  .el-aside {
    background-color: #D3DCE6;
    color: #333;
    text-align: center;
    line-height: 200px;
  }
  
  .el-main {
    background-color: #E9EEF3;
    color: #333;
    text-align: center;
    line-height: 160px;
  }
  
  body > .el-container {
    margin-bottom: 40px;
  }
</style>